<template>
  <div ref="imageWrapper">
    <!-- <div style="display: flex;justify-content: flex-end;">
      <span style="color:red;cursor: pointer;" @click="showPaymentFlowTips = true">审批流程指引</span>
    </div> -->
    <ht-approval
      ref="childrenRef"
      :process-instance-id="processInstanceId"
      :custom="custom"
      :options="options"
      @submit="afterSubmit"
      @reject="afterReject"
      @back="backAction"
      @cancelSubmit="afterCancelSubmit"
      :before-fill-opinion="saveNotifyOpinion"
      :before-submit="beforeSubmit"
      :before-reject="beforeReject"
      :show-task-history="true"
      :history-dialog="historyDialog"
      :task-load="taskLoad"
      :message-id="messageId"
      :showPrintBtn="showPrintBtn"
      :show-upload-btn="false"
      :hidden-task-def-key="hiddenTaskDefKey"
      :print="print"
      :snapshotConfigs="snapshotConfigs"

    >
    </ht-approval>
    
  </div>
</template>

<script>
import Vue from 'vue'
import '@/views/approval/index'
import { postActionAsync, postAction } from '@/api/manage'
import { ACCESS_TOKEN, USER_NAME } from '@/store/mutation-types'
export default {
  props: {
    processInstanceId: {
      type: String,
      default: '-1',
    },
    quality: {
      type: Object,
      default: () => {
        return {}
      },
    },
    customOptions: {
      type: Object,
      default: () => {
        return {}
      },
    },
    checkMethod: {
      type: Function,
      default: function () {
        return false
      },
    },
    getMethod: {
      type: Function,
      default: function () {
        return false
      },
    },
    process: {
      type: Object,
      default: () => {
        return {}
      },
    },
  },
  components: {
    htApproval: () => import('@/config/ht-approval.umd.min.js'),
  },
  data() {
    return {
      showPrintBtn: false,
      hiddenTaskDefKey: '',
      messageId: '', // 工作台URL里面的msgId参数
      options: {
        request: {
          baseUrl: this.API_BASE_URL, // 业务系统根路径
          timeOut: 5000, // 请求超时时间
          interceptors: (config) => {
            config.headers['X-Access-Token'] = Vue.ls.get(ACCESS_TOKEN)
            return config
          },
        },
        userId: Vue.ls.get(USER_NAME),
      },
      historyDialog: {
        // 审批历史模态框属性
      },
      tips: '',
      showRelationUserTips: false,
      custom: {},
      param: {},
      snapshotConfigs: [
        {
          type: 'ref',
          value: 'imageWrapper',
        },
      ],
    }
  },
  methods: {
    
  },
}
</script>

<style lang="less" scoped>
/deep/ #process-container {
  width: unset !important;
}
#process-container {
  background: #fff;
  padding: 40px 22px;
  width: auto;
  margin: 0 auto;
  -webkit-box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.15);
  box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.15);
}
</style>